/* pages/chat/chat.wxss */
.container {
  height: 100vh;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
}

scroll-view{
  flex: 1;
  overflow-y: auto;
}

.card{
  padding: 25rpx 30rpx 0;

  .topic{
    display: flex;
    height: 80rpx;
    border-radius: 16rpx;
    background: #fff;
    padding: 0 32rpx;
    align-items: center;

    .avatar{
      width: 36rpx;
      height: 36rpx;
      border-radius: 18rpx;
      overflow: hidden;
    }
    .tip{
      font-size: 20rpx;
      color: #aaa;
      margin-left: 14rpx;
      display: flex;
      align-items: center;
      .span{
        color: #32A9F5;
        padding: 0 8rpx;
      }
    }
  }

  .video{
    height: 400rpx;
    margin: 36rpx 0 0 ;
    border-radius: 16rpx 16rpx 0 0;
    overflow: hidden;
  }
  .guide{
    background: #fff;
    padding: 32rpx;
    border: 1px #CDCDCD solid;
    // border-width: 0px 1px 1px 1px;
    // border-radius: 0 0 16rpx 16rpx;
    border-width: 1px;
    border-radius: 16rpx;
    margin-top: 20rpx;
    overflow: hidden;

    .info{
      padding: 0 0 36rpx;
      display: flex;
      align-items: center;

      .icon{
        width: 25.22rpx;
        height: 30rpx;
      }
      .title{
        font-size: 24rpx;
        padding: 0 0 0 12rpx;
        flex: 1;
      }
      .ai{
        width: 144rpx;
        height: 42rpx;
        background: #32A9F5;
        border-radius: 21rpx;
        font-size: 24rpx;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;

        image{
          width: 21rpx;
          height: 20rpx;
          margin-right: 10rpx;
        }
      }
    }

    .content{
      font-size: 24rpx;
    }
  }
}

.video-media{
  width: 100%;
  height: 400rpx;
}